<!DOCTYPE html>
<html lang="en">
<head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
</head>
<body>
      城市：<input type="text" id="txt"><button id="btn">查询</button>
      <div id="box"></div>
      <script>

            btn.onclick = function(){
                  console.log(txt.value);
                  var xhr = new XMLHttpRequest();
                  xhr.open("GET" , "./07_weather.php?city="+txt.value);
                  xhr.send();
                  xhr.onreadystatechange = function(){
                        if( xhr.readyState === 4 && /^2\d{2}/.test(xhr.status)){
                              var datas = JSON.parse(xhr.responseText);
                              var html = "";
                              var list = datas.result.data.weather;
                              for(var i=0;i<list.length;i++){
                                    html += `
                                          <ul>
                                                <li>
                                                      星期${list[i].week},天气${list[i].info.dawn[1]},最高温度${list[i].info.day[2]}
                                                </li>
                                          </ul>
                                    `
                              }
                              document.querySelector("#box").innerHTML = html;
                        }
                  }
            }


      </script>
</body>
</html>